//1, 取出video 标签
myid = document.getElementById("gh")
myname = document.getElementById("name")
// v = document.getElementById("v")
// canvas = document.getElementById("canvas")
opencamera()

// takephoto()

function opencamera() {

    //2. 取硬件摄像头 navigator.mediaDevices
    cons = {
        video: {
            width: 300,
            height: 300
        }
    }
    video = navigator.mediaDevices.getUserMedia(cons)

    // 3. 把video标签与硬件关联,对video标签实现播放
    // then 提示下一步,跟一下函数,函数中的参数表示是视频中的内容
    video.then(function (videoStream) {
        v.srcObject = videoStream
        v.play()
    })


}


function takephoto() {

    // 前端画布画图模式两种模式:  2d,3d
    ctx = canvas.getContext("2d")
    ctx.drawImage(v, 0, 0, 300, 300)
    id = myid.value
    name = myname.value
    // 用jquery 的ajax技术实现前端和后端的通信
    face_data = canvas.toDataURL("image/jpg", 0.5)   //把图像转为数据
    //   console.log(face_data)  //data:image/png;base64,
    //去掉前面不需要的字符22个,要以后的
    face_data = face_data.substring(22)
    $.post("/", { "myimg": face_data, "id": id, "name": name }, function (res) {
        console.log(res)
    })
}

function kaoqin() {
    canvas = document.getElementById("canvas")
    // 前端画布画图模式两种模式:  2d,3d
    ctx = canvas.getContext("2d")
    ctx.drawImage(v, 0, 0, 300, 300)

    // 用jquery 的ajax技术实现前端和后端的通信
    face_data = canvas.toDataURL()   //把图像转为数据
    console.log(face_data)  //data:image/png;base64,
    //去掉前面不需要的字符22个,要以后的
    face_data = face_data.substring(22)
    $.post("/kaoqin", { "myimg": face_data }, function (res) {
        console.log(res)
    })
}

function upload_pic() {
    id = myid.value
    name = myname.value
    myfile = document.getElementById("file")
    console.log(myfile) //判断是数组的哪个索引
    try {
        // FileReader 文件读取的工具类
        reader = new FileReader()
        reader.readAsDataURL(myfile)
    } catch (error) {

    }


    reader.onloadend = function () {  //onloadend指文件被加载完毕后

        imgdata = reader.result
        // console.log(imgdata)
        imgdata = imgdata.substring(22)
        $.post("/", { "myimg": face_data, "id": id, "name": name }, function (res) {
            console.log(res)
        })

    }

}


